<div class="ui padded grid">
<div class="row">
    <div class="column">
        <div class="ui segment">
            <div class="ui form" ng-submit="vm.addAccount()" ng-method="post">
                <h4 class="ui dividing header">账户详细信息</h4>
                <label>用户名称</label>
                <div class="field">
                    <input type="text" name="username" ng-model="vm.username">
                </div>
                <label>姓氏</label>
                <div class="field">
                    <input type="text" name="firstName" ng-model="vm.firstName">
                </div>
                <label>名字</label>
                <div class="field">
                    <input type="text" name="lastName" ng-model="vm.lastName">
                </div>
                <label>密码</label>
                <div class="field">
                    <input type="password" name="password" ng-model="vm.password">
                </div>
                <label>角色</label>
                <div class="field">
                    <selectize options="vm.roleOptions" ng-model="vm.userRoles" config="vm.roleConfig"></selectize>
                </div>
                <div class="ui hidden divider"></div>
                <div class="ui green submit button">新增账户</div>
            </div>
        </div>
    </div>
</div>
</div>
<script>
$(function(){
    $('.ui.form')
        .form({
            onSuccess: function() {
                vm.addAccount();
            },
            username: {
                identifier : 'username',
                rules: [
                {
                    type   : 'empty',
                    prompt : 'Please enter a username'
                }
                ]
            },
            firstName: {
                identifier : 'firstName',
                rules: [
                {
                    type   : 'empty',
                    prompt : 'Please enter a first name'
                }
                ]
            },
            lastName: {
                identifier : 'lastName',
                rules: [
                {
                    type   : 'empty',
                    prompt : 'Please enter a last name'
                }
                ]
            },
            password: {
                identifier : 'password',
                rules: [
                {
                    type   : 'empty',
                    prompt : 'Please enter a password'
                }
                ]
            }
        });

    $('.ui.checkbox').checkbox();
});

$('.ui.dropdown').dropdown();
</script>
